.m-search {
  width: 100%;
  height: 3.1rem;
  background: white;
  position: fixed;
  i {
    width: 1.5rem;
    height: 1.5rem;
    display: inline-block;
    background: url('../../assets/appointment/select.png');
    background-size: cover;
    margin-top: 3.5%;
    float: left;
    margin-left: 1rem;
  }
  input {
    width: 15rem;
    height: 2rem;
    border: none;
    vertical-align: top;
    margin-top: 2.5%;
    margin-left: 1rem;
    padding-left: 2%;
  }
  em {
    width: 1.5rem;
    height: 1.5rem;
    display: inline-block;
    background: url('../../assets/appointment/tab.png');
    background-size: cover;
    vertical-align: top;
    margin-top: 3.5%;
    float: right;
    margin-right: 1rem;
    &.hide{
      display: none;
    }
  }
  span {
    width: 1.5rem;
    height: 1.5rem;
    display: inline-block;
    background: url('../../assets/appointment/tab_other.png');
    background-size: cover;
    vertical-align: top;
    margin-top: 3.5%;
    float: right;
    margin-right: 1rem;
    &.hide{
      display: none;
    }
  }
}
.hide {
  display: none;
}
.m-content {
  padding-top: 3rem;
  .m-list {
    width: 100%;
    background: white;
    margin-bottom: 5%;
    .m-listTop {
      width: 94%;
      padding: 3%;
      img{
        width: 100%;
      }
      span{
        font-size: 0.9rem;
        padding: 2% 3%;
        color: white;
        .border-radius(6px);
        background: #22D8D4;
        display: inline-block;
        margin-left: 77%;
        margin-top: 2%;
      }
    }
    .m-listBottom {
      width: 94%;
      padding: 3%;
      border-top: 1px dashed #e6e6e6;
      .m-listBottom-top {
        width: 100%;
        p {
          font-size: 1rem;
          color: black;
          display: inline-block;
        }
        .m-listBottom-topRight {
          color: black;
          margin-left: 46%;
          display: inline-block;
          i {
            width: 1.5rem;
            height: 1.5rem;
            background: url('../../assets/appointment/person_center.png');
            background-position: -389px -525px;
            background-size: 500px;
            display: inline-block;
            vertical-align: top;
            margin-top: -2%;
          }
        }
      }
      .m-listBottom-bottom {
        width: 100%;
        margin-top: 3%;
        i{
          width: 1.5rem;
          height: 1.5rem;
          background: url('../../assets/appointment/person_center.png');
          background-position: -330px -524px;
          background-size: 500px;
          display: inline-block;
          vertical-align: top;
          margin-top: -1%;
        }
      }
    }
    
  }
}
.tab {
  width: 100%;
  padding-top: 14%;
  .m-content-tab {
    margin-top: 3%;
    .m-list {
      width: 94%;
      padding: 2% 3%;
      background: white;
      margin-top: 0;
      border-bottom: 1px solid #feeff1;
      img{
        width: 8rem;
        border-radius: 6px;
      }
      .m-list-center {
        width: 12rem;
        display: inline-block;
        vertical-align: top;
        p.shopname{
          font-size: 1.1rem;
          font-weight: bold;
        }
        span {
          font-size: 0.7rem;
          width: 100%;
          color: black;
          display: block;
          overflow: hidden;
          text-overflow:ellipsis;
          white-space: nowrap;
          i {
            width: 1.5rem;
            height: 1.5rem;
            background: url('../../assets/appointment/person_center.png');
            display: inline-block;
            vertical-align: top;
            margin-top: -1%;
          }
          p {
            display: inline-block;
            vertical-align: top;
          }
          &:nth-child(2),&:nth-child(3){
            margin-top: 2%;
          }
          &:nth-child(2) i{
            background-position: -330px -524px;
            background-size: 500px;
          }
          &:nth-child(3) i{
            background-position: -389px -525px;
            background-size: 500px;
          }
          &:nth-child(2) p{
            margin-top: 0%;
          }
          &:nth-child(3) p{
            margin-top: 3%;
          }
        }
      }
      // &:first-child{
      //   margin-top: 4rem;
      // }
    }
    em {
      width: 1rem;
      height: 1rem;
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      border-right: 1px solid #B7B7B7;
      border-bottom: 1px solid #B7B7B7;
      display: inline-block;
      vertical-align: top;
      margin-top: 8%;
    }
  }
}
